<template>
  <j-modal
    :title="title"
    :width="width"
    draggable
    :visible="visible"
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': false} }"
    @cancel="handleCancel"
    :cancelButtonProps="{ class:{'jee-hidden': true} }"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <j-form-container>
        <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
          <a-row>
            <a-col :span="8">
              <a-form-model-item label="行号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lineNo">
                <a-input v-model="model.lineNo" placeholder="系统自动生成"  disabled></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="物料" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="itemId">
                <j-popup
                  v-model="model.itemName"
                  field="itemId"
                  org-fields="id,name"
                  dest-fields="itemId,itemName"
                  code="wms_item_report"
                  :multi="false"
                  @input="popupCallback"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="需求数量" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="demonQty">
                <a-input-number v-model="model.demonQty" placeholder="请输入需求数量" disabled style="width: 100%" />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="托盘号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="palletNo">
                <a-input v-model="model.palletNo" placeholder="请输入托盘号"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="箱号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="boxNo">
                <a-input v-model="model.boxNo" placeholder="请输入箱号"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="已收货数量" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="receivedQty">
                <a-input-number v-model="model.receivedQty" placeholder="已收货数量"  style="width: 100%" disabled/>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="收货数量" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="inputReceiveQty">
                <a-input-number v-model="model.inputReceiveQty" placeholder="请输入收货数量"  style="width: 100%" />
              </a-form-model-item>
            </a-col>
            <a-divider/>
            <a-col :span="8">
              <a-form-model-item label="销售单" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lot02">
                <a-input v-model="model.lot02" placeholder="请输入销售单"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="供应商代码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lot03">
                <a-input v-model="model.lot03" placeholder="请输入供应商代码"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="ERP代码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lot04">
                <a-input v-model="model.lot04" placeholder="请输入ERP代码"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="等级" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lot05">
                <a-input v-model="model.lot05" placeholder="请输入等级"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="档次" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lot06">
                <a-input v-model="model.lot06" placeholder="请输入档次"  ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="SN号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lot07">
                <a-input v-model="model.lot07" placeholder="请输入SN号"  ></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </j-form-container>
    </a-spin>
  </j-modal>
</template>

<script>
import { postAction } from "@api/manage";
export default {
  name: 'WmsReceiptLineModal',
  components: {},
  data () {
    return {
      title:'明细收货',
      width:1200,
      visible: false,
      disableSubmit: false,
      model:{},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: {
        inputReceiveQty:[
          { required: true, message: '请输入收货数量!' },
        ],
        palletNo:[
          { required: true, message: '请输入托盘号!' },
        ],
      },
      url: {
        receiptLineUrl: "/wms/wmsAsnDetail/detailReceive",
      }
    }
  },
  methods: {
    showReceiptLine(record) {
      this.model = Object.assign({}, record);
      this.visible = true;
    },
    close () {
      this.$emit('ok');
      this.visible = false;
    },
    handleOk () {
      const that = this;
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true;
          postAction(that.url.receiptLineUrl,that.model).then((res)=>{
            if(res.success){
              that.close();
            }else{
              that.$message.warning(res.message);
            }
          }).finally(() => {
            that.confirmLoading = false;
          })
        }
      })
    },
    handleCancel () {
      this.close()
    },
    popupCallback(value,row){
      this.model = Object.assign(this.model, row);
    },
  }
}
</script>